<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>教育考试系统</title>
  <script src="https://cdn.tailwindcss.com"></script>
  <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.8/dist/chart.umd.min.js"></script>

  <!-- 配置Tailwind自定义主题 -->
  <script>
    tailwind.config = {
      theme: {
        extend: {
          colors: {
            primary: '#165DFF',
            secondary: '#36D399',
            accent: '#FF9F43',
            neutral: '#F8FAFC',
            'neutral-dark': '#334155',
          },
          fontFamily: {
            inter: ['Inter', 'system-ui', 'sans-serif'],
          },
        },
      }
    }
  </script>

  <style type="text/tailwindcss">
    @layer utilities {
      .content-auto {
        content-visibility: auto;
      }
      .card-shadow {
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
      }
      .nav-hover {
        @apply transition-all duration-300 hover:bg-primary/10 hover:text-primary;
      }
      .btn-primary {
        @apply bg-primary text-white px-4 py-2 rounded-lg transition-all duration-300 hover:bg-primary/90 active:bg-primary/80;
      }
      .btn-secondary {
        @apply bg-white border border-gray-200 text-neutral-dark px-4 py-2 rounded-lg transition-all duration-300 hover:bg-gray-50 active:bg-gray-100;
      }
    }
  </style>
</head>
<body class="font-inter bg-gray-50 text-neutral-dark min-h-screen flex flex-col">
  <!-- 顶部导航栏 -->
  <header class="bg-white border-b border-gray-200 sticky top-0 z-30">
    <div class="container mx-auto px-4 py-3 flex items-center justify-between">
      <div class="flex items-center space-x-2">
        <i class="fa fa-graduation-cap text-primary text-2xl"></i>
        <h1 class="text-xl font-bold text-primary">智慧教育考试系统</h1>
      </div>

      <div class="flex items-center space-x-6">
        <div class="hidden md:flex items-center space-x-4">
          <button class="text-gray-500 hover:text-primary transition-colors">
            <i class="fa fa-bell-o"></i>
          </button>
          <button class="text-gray-500 hover:text-primary transition-colors">
            <i class="fa fa-cog"></i>
          </button>
        </div>

        <div class="flex items-center space-x-2">
          <div class="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-primary">
            <i class="fa fa-user"></i>
          </div>
          <span class="hidden md:inline">张老师</span>
        </div>
      </div>
    </div>
  </header>

  <!-- 主内容区 -->
  <main class="flex-1 flex flex-col md:flex-row">
    <!-- 左侧导航 -->
    <aside class="w-full md:w-64 bg-white border-r border-gray-200 md:h-[calc(100vh-60px)] sticky md:sticky top-[60px] z-20">
      <!-- 角色切换 -->
      <div class="p-4 border-b border-gray-200">
        <h2 class="text-sm font-medium text-gray-500 mb-2">角色切换</h2>
        <div class="flex rounded-lg overflow-hidden border border-gray-200">
          <button id="teacher-tab" class="flex-1 py-2 px-3 bg-primary text-white text-sm font-medium">
            教师端
          </button>
          <button id="student-tab" class="flex-1 py-2 px-3 bg-white text-gray-600 text-sm font-medium hover:bg-gray-50">
            学生端
          </button>
        </div>
      </div>

      <!-- 教师导航菜单 -->
      <nav id="teacher-nav" class="p-2">
        <ul class="space-y-1">
          <li>
            <a href="/home" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover text-primary bg-primary/10">
              <i class="fa fa-bar-chart w-5 text-center"></i>
              <span>教师控制台</span>
            </a>
          </li>
          <li>
            <a href="/Publish_exam" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-pencil-square-o w-5 text-center"></i>
              <span>发布考试</span>
            </a>
          </li>
          <li>
            <a href="/History_exam" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-history w-5 text-center"></i>
              <span>历史考试</span>
            </a>
          </li>
          <li>
            <a href="/Set_questions" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-magic w-5 text-center"></i>
              <span>一键出题</span>
            </a>
          </li>
          <li>
            <a href="/Question_Bank" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-book w-5 text-center"></i>
              <span>题库管理</span>
            </a>
          </li>
          <li>
            <a href="/stu_management" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-users w-5 text-center"></i>
              <span>学生管理</span>
            </a>
          </li>
          <li>
            <a href="/class_management" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-th-large w-5 text-center"></i>
              <span>班级管理</span>
            </a>
          </li>
        </ul>
      </nav>

      <!-- 学生导航菜单 (默认隐藏) -->
      <nav id="student-nav" class="p-2 hidden">
        <ul class="space-y-1">
          <li>
            <a href="/Exam_record" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-file-text-o w-5 text-center"></i>
              <span>个人考试记录</span>
            </a>
          </li>
          <li>
            <a href="/Waiting_exam" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-clock-o w-5 text-center"></i>
              <span>待考试</span>
              <span class="ml-auto bg-accent text-white text-xs px-2 py-0.5 rounded-full">3</span>
            </a>
          </li>
          <li>
            <a href="/Mistake_question" class="flex items-center space-x-3 px-3 py-2.5 rounded-lg nav-hover">
              <i class="fa fa-exclamation-circle w-5 text-center"></i>
              <span>错题本</span>
            </a>
          </li>
        </ul>
      </nav>
    </aside>

    <!-- 右侧内容区 -->
    <div class="flex-1 p-4 md:p-6 overflow-auto">
      <!-- 教师端内容 -->
      <div id="teacher-content">
        <div class="flex flex-col md:flex-row md:items-center justify-between mb-6">
          <div>
            <h2 class="text-[clamp(1.5rem,3vw,2rem)] font-bold">教师控制台</h2>
            <p class="text-gray-500">欢迎回来，今天是 <span id="current-date">2025年10月24日</span></p>
          </div>
        </div>

        <!-- 数据概览卡片 -->
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">总学生数</p>
                <h3 class="text-3xl font-bold mt-1">142</h3>
                <p class="text-secondary text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 5.2% <span class="text-gray-500 ml-1">较上月</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary">
                <i class="fa fa-users text-xl"></i>
              </div>
            </div>
          </div>

          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">进行中考试</p>
                <h3 class="text-3xl font-bold mt-1">8</h3>
                <p class="text-secondary text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 2 <span class="text-gray-500 ml-1">较上周</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-accent/10 flex items-center justify-center text-accent">
                <i class="fa fa-clock-o text-xl"></i>
              </div>
            </div>
          </div>

          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">已创建题库</p>
                <h3 class="text-3xl font-bold mt-1">24</h3>
                <p class="text-secondary text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 3 <span class="text-gray-500 ml-1">本月新增</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-purple-100 flex items-center justify-center text-purple-600">
                <i class="fa fa-book text-xl"></i>
              </div>
            </div>
          </div>

          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">待批改试卷</p>
                <h3 class="text-3xl font-bold mt-1">16</h3>
                <p class="text-red-500 text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 4 <span class="text-gray-500 ml-1">较昨日</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-red-100 flex items-center justify-center text-red-500">
                <i class="fa fa-pencil text-xl"></i>
              </div>
            </div>
          </div>
        </div>

        <!-- 学习数据图表 -->
<!--        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">-->
<!--          <div class="bg-white rounded-xl p-5 card-shadow lg:col-span-2">-->
<!--            <div class="flex justify-between items-center mb-4">-->
<!--              <h3 class="font-bold text-lg">学生成绩趋势</h3>-->
<!--              <div class="flex space-x-2">-->
<!--                <button class="btn-secondary text-sm py-1">周</button>-->
<!--                <button class="btn-secondary text-sm py-1 bg-primary/10 text-primary">月</button>-->
<!--                <button class="btn-secondary text-sm py-1">学期</button>-->
<!--              </div>-->
<!--            </div>-->
<!--            <div class="h-64">-->
<!--              <canvas id="scoreChart"></canvas>-->
<!--            </div>-->
<!--          </div>-->

<!--          <div class="bg-white rounded-xl p-5 card-shadow">-->
<!--            <h3 class="font-bold text-lg mb-4">知识点掌握情况</h3>-->
<!--            <div class="h-64">-->
<!--              <canvas id="knowledgeChart"></canvas>-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->

        <!-- 快速操作 -->
        <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
          <button onclick="window.location.href='/Set_questions'" class="bg-white rounded-xl p-4 card-shadow flex flex-col items-center justify-center hover:border-primary hover:border transition-all">
            <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-3">
              <i class="fa fa-magic text-xl"></i>
            </div>
            <span class="font-medium">一键出题</span>
          </button>

          <button onclick="window.location.href='/Publish_exam'" class="bg-white rounded-xl p-4 card-shadow flex flex-col items-center justify-center hover:border-primary hover:border transition-all">
            <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-3">
              <i class="fa fa-file-text-o text-xl"></i>
            </div>
            <span class="font-medium">发布考试</span>
          </button>

          <button onclick="window.location.href='/Question_Bank'" class="bg-white rounded-xl p-4 card-shadow flex flex-col items-center justify-center hover:border-primary hover:border transition-all">
            <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-3">
              <i class="fa fa-book text-xl"></i>
            </div>
            <span class="font-medium">题库管理</span>
          </button>

          <button onclick="window.location.href='/stu_management'" class="bg-white rounded-xl p-4 card-shadow flex flex-col items-center justify-center hover:border-primary hover:border transition-all">
            <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-3">
              <i class="fa fa-users text-xl"></i>
            </div>
            <span class="font-medium">学生管理</span>
          </button>
        </div>
      </div>

      <!-- 学生端内容 (默认隐藏) -->
      <div id="student-content" class="hidden">
        <div class="flex flex-col md:flex-row md:items-center justify-between mb-6">
          <div>
            <h2 class="text-[clamp(1.5rem,3vw,2rem)] font-bold">学生学习中心</h2>
            <p class="text-gray-500">欢迎回来，今天是 <span id="current-date-stu">2025年10月24日</span></p>
          </div>
          <div class="mt-4 md:mt-0">
            <button class="btn-primary flex items-center">
              <i class="fa fa-calendar-plus-o mr-2"></i> 今日学习
            </button>
          </div>
        </div>

        <!-- 学习进度卡片 -->
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">本周学习时长</p>
                <h3 class="text-3xl font-bold mt-1">8.5h</h3>
                <p class="text-secondary text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 12% <span class="text-gray-500 ml-1">较上周</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center text-primary">
                <i class="fa fa-clock-o text-xl"></i>
              </div>
            </div>
          </div>

          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">已完成题目</p>
                <h3 class="text-3xl font-bold mt-1">142</h3>
                <p class="text-secondary text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-up mr-1"></i> 38 <span class="text-gray-500 ml-1">本周</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-green-100 flex items-center justify-center text-green-600">
                <i class="fa fa-check-square-o text-xl"></i>
              </div>
            </div>
          </div>

          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-start">
              <div>
                <p class="text-gray-500 text-sm">错题数量</p>
                <h3 class="text-3xl font-bold mt-1">24</h3>
                <p class="text-red-500 text-sm mt-2 flex items-center">
                  <i class="fa fa-arrow-down mr-1"></i> 8 <span class="text-gray-500 ml-1">较上周</span>
                </p>
              </div>
              <div class="w-12 h-12 rounded-full bg-red-100 flex items-center justify-center text-red-500">
                <i class="fa fa-exclamation-circle text-xl"></i>
              </div>
            </div>
          </div>

<!--          <div class="bg-white rounded-xl p-5 card-shadow">-->
<!--            <div class="flex justify-between items-start">-->
<!--              <div>-->
<!--                <p class="text-gray-500 text-sm">收藏题目</p>-->
<!--                <h3 class="text-3xl font-bold mt-1">16</h3>-->
<!--                <p class="text-secondary text-sm mt-2 flex items-center">-->
<!--                  <i class="fa fa-arrow-up mr-1"></i> 3 <span class="text-gray-500 ml-1">本周新增</span>-->
<!--                </p>-->
<!--              </div>-->
<!--              <div class="w-12 h-12 rounded-full bg-yellow-100 flex items-center justify-center text-yellow-600">-->
<!--                <i class="fa fa-star-o text-xl"></i>-->
<!--              </div>-->
<!--            </div>-->
<!--          </div>-->
        </div>

        <!-- 待考试和学习计划 -->
        <div class="grid grid-cols-1 lg:grid-cols-1 gap-6 mb-6">
          <!-- 待考试 -->
          <div class="bg-white rounded-xl p-5 card-shadow">
            <div class="flex justify-between items-center mb-4">
              <h3 class="font-bold text-lg">待考试</h3>
              <a href="#" class="text-primary text-sm hover:underline">查看全部</a>
            </div>

            <div class="space-y-4">
              <div class="border border-gray-100 rounded-lg p-4 hover:border-primary transition-colors">
                <div class="flex justify-between items-start">
                  <h4 class="font-medium">高一数学周测</h4>
                  <span class="bg-accent/10 text-accent text-xs px-2 py-1 rounded-full">重要</span>
                </div>
                <p class="text-gray-500 text-sm mt-2">时间：10月25日 14:30-15:30</p>
                <p class="text-gray-500 text-sm">时长：60分钟 | 满分：100分</p>
                <div class="mt-3 flex justify-end">
                  <button class="btn-primary text-sm py-1">进入考场</button>
                </div>
              </div>

              <div class="border border-gray-100 rounded-lg p-4 hover:border-primary transition-colors">
                <div class="flex justify-between items-start">
                  <h4 class="font-medium">英语听力训练</h4>
                  <span class="bg-blue-100 text-blue-600 text-xs px-2 py-1 rounded-full">常规</span>
                </div>
                <p class="text-gray-500 text-sm mt-2">时间：10月26日 09:00-09:30</p>
                <p class="text-gray-500 text-sm">时长：30分钟 | 满分：50分</p>
                <div class="mt-3 flex justify-end">
                  <button class="btn-primary text-sm py-1">进入考场</button>
                </div>
              </div>

              <div class="border border-gray-100 rounded-lg p-4 hover:border-primary transition-colors">
                <div class="flex justify-between items-start">
                  <h4 class="font-medium">物理单元测试</h4>
                  <span class="bg-blue-100 text-blue-600 text-xs px-2 py-1 rounded-full">常规</span>
                </div>
                <p class="text-gray-500 text-sm mt-2">时间：10月27日 16:00-17:00</p>
                <p class="text-gray-500 text-sm">时长：60分钟 | 满分：100分</p>
                <div class="mt-3 flex justify-end">
                  <button class="btn-primary text-sm py-1">进入考场</button>
                </div>
              </div>
            </div>
          </div>

          <!-- 今日学习计划 -->
<!--          <div class="bg-white rounded-xl p-5 card-shadow">-->
<!--            <div class="flex justify-between items-center mb-4">-->
<!--              <h3 class="font-bold text-lg">今日学习计划</h3>-->
<!--              <button class="text-primary text-sm hover:underline flex items-center">-->
<!--                <i class="fa fa-pencil mr-1"></i> 编辑-->
<!--              </button>-->
<!--            </div>-->

<!--            <div class="space-y-3">-->
<!--              <div class="flex items-center p-2 border-l-4 border-secondary bg-secondary/5 rounded">-->
<!--                <input type="checkbox" checked class="mr-3 w-4 h-4 accent-secondary">-->
<!--                <span class="line-through text-gray-500">完成数学课后习题（30分钟）</span>-->
<!--              </div>-->

<!--              <div class="flex items-center p-2 border-l-4 border-secondary bg-secondary/5 rounded">-->
<!--                <input type="checkbox" checked class="mr-3 w-4 h-4 accent-secondary">-->
<!--                <span class="line-through text-gray-500">背诵英语单词50个（20分钟）</span>-->
<!--              </div>-->

<!--              <div class="flex items-center p-2 border-l-4 border-gray-300 bg-gray-50 rounded">-->
<!--                <input type="checkbox" class="mr-3 w-4 h-4 accent-secondary">-->
<!--                <span>复习物理第三章知识点（40分钟）</span>-->
<!--              </div>-->

<!--              <div class="flex items-center p-2 border-l-4 border-gray-300 bg-gray-50 rounded">-->
<!--                <input type="checkbox" class="mr-3 w-4 h-4 accent-secondary">-->
<!--                <span>完成每日一练（20分钟）</span>-->
<!--              </div>-->

<!--              <div class="flex items-center p-2 border-l-4 border-gray-300 bg-gray-50 rounded">-->
<!--                <input type="checkbox" class="mr-3 w-4 h-4 accent-secondary">-->
<!--                <span>整理上周错题（30分钟）</span>-->
<!--              </div>-->
<!--            </div>-->

<!--            <div class="mt-4">-->
<!--              <button class="w-full py-2 border border-dashed border-gray-300 rounded-lg text-gray-500 hover:border-primary hover:text-primary transition-colors">-->
<!--                <i class="fa fa-plus mr-1"></i> 添加学习任务-->
<!--              </button>-->
<!--            </div>-->
<!--          </div>-->
        </div>

        <!-- 学习数据和快速入口 -->
        <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
          <!-- 学习数据 -->
<!--          <div class="bg-white rounded-xl p-5 card-shadow">-->
<!--            <h3 class="font-bold text-lg mb-4">学习数据</h3>-->
<!--            <div class="h-64">-->
<!--              <canvas id="studentChart"></canvas>-->
<!--            </div>-->
<!--          </div>-->

          <!-- 快速入口 -->
          <div class="bg-white rounded-xl p-5 card-shadow lg:col-span-2">
            <h3 class="font-bold text-lg mb-4">快速入口</h3>
            <div class="grid grid-cols-2 md:grid-cols-3 gap-3">
<!--              <a href="#" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">-->
<!--                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">-->
<!--                  <i class="fa fa-pencil"></i>-->
<!--                </div>-->
<!--                <span class="text-sm text-center">每日一练</span>-->
<!--              </a>-->

<!--              <a href="#" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">-->
<!--                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">-->
<!--                  <i class="fa fa-calendar-check-o"></i>-->
<!--                </div>-->
<!--                <span class="text-sm text-center">周测</span>-->
<!--              </a>-->

<!--              <a href="#" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">-->
<!--                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">-->
<!--                  <i class="fa fa-calendar-plus-o"></i>-->
<!--                </div>-->
<!--                <span class="text-sm text-center">月考</span>-->
<!--              </a>-->

              <a href="/Mistake_question" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">
                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">
                  <i class="fa fa-exclamation-circle"></i>
                </div>
                <span class="text-sm text-center">错题本</span>
              </a>

<!--              <a href="#" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">-->
<!--                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">-->
<!--                  <i class="fa fa-star-o"></i>-->
<!--                </div>-->
<!--                <span class="text-sm text-center">收藏题库</span>-->
<!--              </a>-->

              <a href="/Exam_record" class="flex flex-col items-center p-4 border border-gray-100 rounded-lg hover:border-primary hover:bg-primary/5 transition-all">
                <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center text-primary mb-2">
                  <i class="fa fa-file-text-o"></i>
                </div>
                <span class="text-sm text-center">考试记录</span>
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
      </div>
  </main>

  <!-- 页脚 -->
  <footer class="bg-white border-t border-gray-200 py-4">
    <div class="container mx-auto px-4 text-center text-gray-500 text-sm">
      <p>© 2025 智慧教育考试系统 版权所有</p>
    </div>
  </footer>

  <script>
    // 设置当前日期
    const setCurrentDate = () => {
      const now = new Date();
      const year = now.getFullYear();
      const month = now.getMonth() + 1;
      const day = now.getDate();
      const dateStr = `${year}年${month}月${day}日`;
      document.getElementById('current-date').textContent = dateStr;
      document.getElementById('current-date-stu').textContent = dateStr;
    };

    //定义全局变量
    var identity = '学生'

    //获取后端登录信息
    const get_identity = async () => {
      const response = await fetch('/api/current-user')
      const result = await response.json()
      identity = result.identity
        console.log(identity)
    }

    // 角色切换功能
    const setupRoleSwitch = () => {
      const teacherTab = document.getElementById('teacher-tab');
      const studentTab = document.getElementById('student-tab');
      const teacherNav = document.getElementById('teacher-nav');
      const studentNav = document.getElementById('student-nav');
      const teacherContent = document.getElementById('teacher-content');
      const studentContent = document.getElementById('student-content');

      if(identity == '教师'){
        teacherTab.classList.add('bg-primary', 'text-white');
        teacherTab.classList.remove('bg-white', 'text-gray-600', 'hover:bg-gray-50');
        studentTab.classList.add('bg-white', 'text-gray-600', 'hover:bg-gray-50');
        studentTab.classList.remove('bg-primary', 'text-white');

        // 显示教师内容，隐藏学生内容
        teacherNav.classList.remove('hidden');
        studentNav.classList.add('hidden');
        teacherContent.classList.remove('hidden');
        studentContent.classList.add('hidden');
      }
      else if (identity == '学生'){
        studentTab.classList.add('bg-primary', 'text-white');
        studentTab.classList.remove('bg-white', 'text-gray-600', 'hover:bg-gray-50');
        teacherTab.classList.add('bg-white', 'text-gray-600', 'hover:bg-gray-50');
        teacherTab.classList.remove('bg-primary', 'text-white');

        // 显示学生内容，隐藏教师内容
        studentNav.classList.remove('hidden');
        teacherNav.classList.add('hidden');
        studentContent.classList.remove('hidden');
        teacherContent.classList.add('hidden');
      }
    };

    // 初始化图表
    const initCharts = () => {
      // 教师端 - 学生成绩趋势图
      const scoreCtx = document.getElementById('scoreChart').getContext('2d');
      new Chart(scoreCtx, {
        type: 'line',
        data: {
          labels: ['第1周', '第2周', '第3周', '第4周', '第5周', '第6周', '第7周', '第8周'],
          datasets: [{
            label: '平均分',
            data: [72, 75, 73, 78, 80, 79, 82, 85],
            borderColor: '#165DFF',
            backgroundColor: 'rgba(22, 93, 255, 0.1)',
            tension: 0.4,
            fill: true
          }]
        },
        options: {
          responsive: true,
          maintainAspectRatio: false,
          plugins: {
            legend: {
              display: false
            }
          },
          scales: {
            y: {
              min: 60,
              max: 100,
              ticks: {
                stepSize: 10
              }
            }
          }
        }
      });

      // 教师端 - 知识点掌握情况
      const knowledgeCtx = document.getElementById('knowledgeChart').getContext('2d');
      new Chart(knowledgeCtx, {
        type: 'radar',
        data: {
          labels: ['函数', '几何', '代数', '概率', '统计', '三角'],
          datasets: [{
            label: '掌握度',
            data: [75, 68, 82, 70, 85, 65],
            backgroundColor: 'rgba(22, 93, 255, 0.2)',
            borderColor: '#165DFF',
            pointBackgroundColor: '#165DFF'
          }]
        },
        options: {
          responsive: true,
          maintainAspectRatio: false,
          scales: {
            r: {
              min: 0,
              max: 100,
              ticks: {
                stepSize: 20,
                display: false
              }
            }
          }
        }
      });

      // 学生端 - 学习数据
      const studentCtx = document.getElementById('studentChart').getContext('2d');
      new Chart(studentCtx, {
        type: 'bar',
        data: {
          labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
          datasets: [{
            label: '学习时长(小时)',
            data: [1.2, 0.8, 1.5, 1.0, 1.8, 2.2, 0.0],
            backgroundColor: '#165DFF'
          }]
        },
        options: {
          responsive: true,
          maintainAspectRatio: false,
          plugins: {
            legend: {
              display: false
            }
          },
          scales: {
            y: {
              beginAtZero: true
            }
          }
        }
      });
    };

    // 页面加载完成后初始化
    document.addEventListener('DOMContentLoaded', async () => {
        await get_identity();
        setCurrentDate();
        setupRoleSwitch();
        initCharts();
    });
  </script>
</body>
</html>